<?php

session_start();
include ('include/header.php');
?>
<script>
    function bonmail(mailteste)

    {
        var reg = new RegExp('^[a-z0-9]+([_|\.|-]{1}[a-z0-9]+)*@[a-z0-9]+([_|\.|-]{1}[a-z0-9]+)*[\.]{1}[a-z]{2,6}$', 'i');

        return(reg.test(mailteste));
    }
    $(function() {
        $(".inscription").click(function()
        {
            $(".nom_erreur").fadeIn(400).html('');
            $(".prenom_erreur").fadeIn(400).html('');
            $(".email_erreur").fadeIn(400).html('');
            $(".mdp_erreur").fadeIn(400).html('');
            $(".mdp_conf_erreur").fadeIn(400).html('');
            
            
            var nom = $("#nom").val();
            var prenom = $("#prenom").val();
            var email = $("#email_inscription").val();
            var mdp = $("#mdp_inscription").val();
            var mdp_conf = $("#mdp_conf").val();
            var bot = $("#id").val();
           
            var urlenvoye = 'nom='+ nom + '&prenom='+ prenom + '&email='+ email + '&mdp='+ encodeURIComponent(mdp);
            
            if(bot !== '')
            {
                exit();
            }
            
            if(bonmail(email)== true){
                var email_true=1;
                
            }
            else{
                var email_true=0;
            }
            
            if(nom==='' | prenom==='' | email==='' | mdp==='' | mdp_conf===''  | mdp!=mdp_conf | email_true==0) 
            {
                if(nom==='')
                {
                    $(".nom_erreur").show();
                    $(".nom_erreur").fadeIn(400).html("<img class='vertical_image' src='assets/image/attention.png' width='30px' />&nbsp;&nbsp;Ce champ n'a pas été remplis.");           
                }
                if(prenom===''){
                    $(".prenom_erreur").show();
                    $(".prenom_erreur").fadeIn(400).html("<img class='vertical_image' src='assets/image/attention.png' width='30px' />&nbsp;&nbsp;Ce champ n'a pas été remplis.");           
                }
                if(email===''){
                    $(".email_erreur").show();
                    $(".email_erreur").fadeIn(400).html("<img class='vertical_image' src='assets/image/attention.png' width='30px' />&nbsp;&nbsp;Ce champ n'a pas été remplis.");           
                }
                if(mdp===''){
                    $(".mdp_erreur").show();
                    $(".mdp_erreur").fadeIn(400).html("<img class='vertical_image' src='assets/image/attention.png' width='30px' />&nbsp;&nbsp;Ce champ n'a pas été remplis.");           
                }
                if(mdp_conf===''){
                    $(".mdp_conf_erreur").show();
                    $(".mdp_conf_erreur").fadeIn(400).html("<img class='vertical_image' src='assets/image/attention.png' width='30px' />&nbsp;&nbsp;Ce champ n'a pas été remplis.");           
                }
                   
                if(mdp != mdp_conf){
                    $(".mdp_conf_erreur").show();
                    $(".mdp_conf_erreur").fadeIn(400).html("<img class='vertical_image' src='assets/image/attention.png' width='30px' />&nbsp;&nbsp;Les mots de passe ne correspondent pas.");                            
                }
                if(email_true==0){
                    $(".email_erreur").show();
                    $(".email_erreur").fadeIn(400).html("<img class='vertical_image' src='assets/image/attention.png' width='30px' />&nbsp;&nbsp;Cette adresse n'est pas une adresse email valide.");                            
                }
                    
            }
         
            else{ 
                $(".erreur_form3").fadeIn(400).html("<img class='vertical_image' src='assets/image/loading2.gif' width='30px' />&nbsp;&nbsp;<span class='chargement_auth' style='color:green'>Chargement ...</span>");
                $.ajax({
                    type: "POST",
                    url: "verifier_inscription.php",
                    data: urlenvoye,
                    cache: false,
                    success: function(html){
                        $(".form_champ").slideToggle('slow');
                        $(".erreur_form3").fadeIn(400).html("");
                        $(".erreur_form3").append(html);
                    }
        
                });
            }return false;
        }); });
</script>

<div id="content">
    <div class="titre">
        Creation d'un compte<br>
    </div>
    <div class="formulaire_inscription">
        <form method="post" action="#">
            <div class="form_champ">
                <div class="champForm2">
                    <span class="champ1_form"><span style="color:red">*</span><b>Nom : </b></span><span class="champ2_form"><input class="input_inscription" type="text" id="nom" name="nom" onClick="this.style.border='solid #F68B2E 1px'" onBlur="this.style.border='solid #C7C7C7 1px'"></span><span class="nom_erreur"></span>
                </div>
                <div class="champForm2">
                    <span class="champ1_form"><span style="color:red">*</span><b>Prénom : </b></span><span class="champ2_form"><input class="input_inscription" type="text" id="prenom" name="prenom" onClick="this.style.border='solid #F68B2E 1px'" onBlur="this.style.border='solid #C7C7C7 1px'"></span><span class="prenom_erreur"></span>
                </div>
                <div class="champForm2">
                    <span class="champ1_form"><span style="color:red">*</span><b>Email : </b></span><span class="champ2_form"><input class="input_inscription" type="text" id="email_inscription" name="email" onClick="this.style.border='solid #F68B2E 1px'" onBlur="this.style.border='solid #C7C7C7 1px'"></span><span class="email_erreur"></span>
                </div>
                <div class="champForm2">
                    <span class="champ1_form"><span style="color:red">*</span><b>Mot de passe : </b></span><span class="champ2_form"><input class="input_inscription" type="password" id="mdp_inscription" name="mdp" onClick="this.style.border='solid #F68B2E 1px'" onBlur="this.style.border='solid #C7C7C7 1px'"></span><span class="mdp_erreur"></span>
                </div>
                <div class="champForm2">
                    <span class="champ1_form"><span style="color:red">*</span><b>Confirmation : </b></span><span class="champ2_form"><input class="input_inscription" type="password" id="mdp_conf" name="mdp_conf" onClick="this.style.border='solid #F68B2E 1px'" onBlur="this.style.border='solid #C7C7C7 1px'"></span><span class="mdp_conf_erreur"></span>
                </div>

                <input type="text" id="id" style="visibility:hidden">
                <input class="inscription" border=0 src="assets/image/inscription.png" type=image Value=submit align="middle" > 
            </div>   
            <span class="erreur_form3"></span>
        </form>
    </div>  
</div>

<?php

include("include/footer.php");